<template>
  <div v-permission="['home.newPersonalSettings.IdentityManagement.see']">
    <div class="button__example--wrap">
      <!-- 如当前用户为“海外”用户，已存在一个身份后，则隐藏【加入企业】操作按钮 -->
      <el-button
        type="primary"
        @click="joinCompany"
        style="margin-bottom:10px"
        v-if="!(userInfo?.userType == 'OVERSEAS' && tableData.length > 1)"
        v-permission="['home.newPersonalSettings.IdentityManagement.add']"
        >{{ t('keys.joinTheCompany') }}</el-button
      >
    </div>
    <base-table
      ref="tableRefCom"
      v-loading="loading"
      border
      :row-style="{ cursor: 'pointer' }"
      row-key="id"
      rowKey="id"
      :columns="identityManagementList"
      :data="tableData"
      :pagination="{
        currentPage: defaultParams.page,
        total: total,
        onSizeChange: handleSizeChange,
        onCurrentChange: handleCurrentChange
      }"
    >
      <template #defaultEmpFlag="scope">
        {{ scope.row.defaultEmpFlag ? t('keys.yes') : t('keys.no') }}
      </template>
      <template #action="scope">
        <el-button type="info" link style="color:#3487e2" @click="postSettingEmpDefault(scope.row)" v-if="!scope.row.defaultEmpFlag">{{
          t('keys.Set_default_identity')
        }}</el-button>
        <el-button
          type="danger"
          link
          @click="onAssociatedUser(scope.row)"
          v-if="!scope.row.defaultEmpFlag"
          v-permission="['home.newPersonalSettings.IdentityManagement.out']"
          >{{ t('keys.exit_enterprise') }}</el-button
        >
      </template>
    </base-table>

    <jion-compy-dialog ref="jionCompyDialogRef" @refresh="getList()"></jion-compy-dialog>
  </div>
</template>

<script setup>
import { onActivated, ref, reactive, nextTick } from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import { useMock } from '../hooks/useSearch'
import { useBasicData } from '../hooks/useBasicData'
import { empMineListApi, getempUserId, postSettingEmpDefaultApi } from 'api/home'
import { useRouter } from 'vue-router'
import { ERR_OK, ERR_FORM_CODE } from 'config/statusCode'
import jionCompyDialog from './jionCompyDialog.vue'
import { useI18n } from 'vue-i18n'
const { t } = useI18n()
const { identityManagementList } = useMock()
const router = useRouter()
const { defaultParams, tableData, total, loading, tableRefCom, getList, handleSizeChange, handleCurrentChange } = useBasicData({
  listFun: empMineListApi
})
const userInfo = ref(JSON.parse(localStorage.getItem('userinfo')))

getList()
onActivated(() => {
  getList()
})

// 解除关系提醒
const onAssociatedUser = (row) => {
  if (row.empId) {
    ElMessageBox.confirm(`${t('keys.Are_you_quit')}【${row.tenantName}】？`, t('keys.remind'), {
      confirmButtonText: t('keys.ok'),
      cancelButtonText: t('keys.cancel'),
      type: 'warning'
    })
      .then(async () => {
        const { code } = await getempUserId(row.userEmpId)
        if (code === ERR_OK) {
          ElMessage({
            message: t('keys.dissolved_association_user_tips'),
            type: 'success'
          })
          getList()
        }
      })
      .catch(() => {
        ElMessage({
          type: 'info',
          message: t('keys.haveCanceled_tips')
        })
      })
  }
}

// 设置默认身份
const postSettingEmpDefault = async (row) => {
  ElMessageBox.confirm(t('keys.Are_yo_employee_default'), t('keys.remind'), {
    confirmButtonText: t('keys.ok'),
    cancelButtonText: t('keys.cancel'),
    type: 'warning'
  }).then(async () => {
    const params = { empId: row.empId, roleId: row.roleId }
    const { code } = await postSettingEmpDefaultApi(params, JSON.parse(localStorage.getItem('userinfo'))['userId'])
    if (code === ERR_OK) {
      ElMessage({
        message: t('keys.Setting_succeeded'),
        type: 'success'
      })
      getList()
    }
  })
}

const jionCompyDialogRef = ref(null)
// 加入企业
const joinCompany = (row) => {
  jionCompyDialogRef.value.showDialog()
}
</script>

<style lang="scss" scoped>
.istop {
  background: #fff3e8;
  border-radius: 2px;
  border: 1px solid #ff6700;
  font-size: 12px;
  font-weight: 500;
  color: #ff6700;
  line-height: 1;
  width: 32px;
  height: 16px;
  margin-right: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
</style>
